/**
 * DNS管理系统 - 主JavaScript文件
 * 提供交互功能和用户体验优化
 */

document.addEventListener('DOMContentLoaded', function() {
    // 初始化所有功能
    initTooltips();
    initConfirmDialogs();
    initFormValidation();
    initTableInteractions();
    initNotifications();
    initLoadingStates();
    initThemeToggle();
});

/**
 * 初始化工具提示
 */
function initTooltips() {
    const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
    tooltipTriggerList.map(function(tooltipTriggerEl) {
        return new bootstrap.Tooltip(tooltipTriggerEl);
    });
}

/**
 * 初始化确认对话框
 */
function initConfirmDialogs() {
    // 为所有危险操作添加确认对话框
    document.querySelectorAll('[data-confirm]').forEach(function(element) {
        element.addEventListener('click', function(e) {
            const message = element.getAttribute('data-confirm') || '确定要执行此操作吗？';
            if (!confirm(message)) {
                e.preventDefault();
                return false;
            }
        });
    });

    // 删除按钮特殊处理
    document.querySelectorAll('.btn-danger, .text-danger').forEach(function(element) {
        if (element.textContent.includes('删除') || element.href && element.href.includes('delete')) {
            element.addEventListener('click', function(e) {
                const message = '确定要删除吗？此操作不可恢复！';
                if (!confirm(message)) {
                    e.preventDefault();
                    return false;
                }
            });
        }
    });
}

/**
 * 初始化表单验证
 */
function initFormValidation() {
    // Bootstrap表单验证
    const forms = document.querySelectorAll('.needs-validation');
    Array.prototype.slice.call(forms).forEach(function(form) {
        form.addEventListener('submit', function(event) {
            if (!form.checkValidity()) {
                event.preventDefault();
                event.stopPropagation();
            }
            form.classList.add('was-validated');
        }, false);
    });

    // 实时验证
    document.querySelectorAll('input[type="email"]').forEach(function(input) {
        input.addEventListener('blur', function() {
            validateEmail(this);
        });
    });

    document.querySelectorAll('input[name="name"]').forEach(function(input) {
        input.addEventListener('blur', function() {
            validateRequired(this, '名称不能为空');
        });
    });
}

/**
 * 电子邮件验证
 */
function validateEmail(input) {
    const email = input.value.trim();
    const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    
    if (email && !emailPattern.test(email)) {
        showFieldError(input, '请输入有效的电子邮件地址');
        return false;
    }
    
    clearFieldError(input);
    return true;
}

/**
 * 必填字段验证
 */
function validateRequired(input, message) {
    const value = input.value.trim();
    
    if (!value) {
        showFieldError(input, message);
        return false;
    }
    
    clearFieldError(input);
    return true;
}

/**
 * 显示字段错误
 */
function showFieldError(input, message) {
    clearFieldError(input);
    
    input.classList.add('is-invalid');
    
    const feedback = document.createElement('div');
    feedback.className = 'invalid-feedback';
    feedback.textContent = message;
    
    input.parentNode.appendChild(feedback);
}

/**
 * 清除字段错误
 */
function clearFieldError(input) {
    input.classList.remove('is-invalid');
    
    const feedback = input.parentNode.querySelector('.invalid-feedback');
    if (feedback) {
        feedback.remove();
    }
}

/**
 * 初始化表格交互
 */
function initTableInteractions() {
    // 表格行点击高亮
    document.querySelectorAll('table tbody tr').forEach(function(row) {
        row.addEventListener('click', function(e) {
            // 如果点击的是按钮或链接，不处理
            if (e.target.tagName === 'A' || e.target.tagName === 'BUTTON' || 
                e.target.closest('a') || e.target.closest('button')) {
                return;
            }
            
            // 移除其他行的高亮
            document.querySelectorAll('table tbody tr.table-active').forEach(function(activeRow) {
                activeRow.classList.remove('table-active');
            });
            
            // 高亮当前行
            this.classList.add('table-active');
        });
    });

    // 表格排序
    document.querySelectorAll('th[data-sort]').forEach(function(header) {
        header.style.cursor = 'pointer';
        header.addEventListener('click', function() {
            sortTable(this);
        });
    });
}

/**
 * 表格排序功能
 */
function sortTable(header) {
    const table = header.closest('table');
    const tbody = table.querySelector('tbody');
    const rows = Array.from(tbody.querySelectorAll('tr'));
    const columnIndex = Array.from(header.parentNode.children).indexOf(header);
    const sortDirection = header.getAttribute('data-sort-direction') === 'asc' ? 'desc' : 'asc';
    
    rows.sort(function(a, b) {
        const aValue = a.cells[columnIndex].textContent.trim();
        const bValue = b.cells[columnIndex].textContent.trim();
        
        if (sortDirection === 'asc') {
            return aValue.localeCompare(bValue);
        } else {
            return bValue.localeCompare(aValue);
        }
    });
    
    // 更新表格
    rows.forEach(function(row) {
        tbody.appendChild(row);
    });
    
    // 更新排序指示器
    document.querySelectorAll('th[data-sort]').forEach(function(th) {
        th.removeAttribute('data-sort-direction');
        th.querySelector('.sort-indicator')?.remove();
    });
    
    header.setAttribute('data-sort-direction', sortDirection);
    const indicator = document.createElement('i');
    indicator.className = `bi bi-arrow-${sortDirection === 'asc' ? 'up' : 'down'} sort-indicator ms-2`;
    header.appendChild(indicator);
}

/**
 * 初始化通知系统
 */
function initNotifications() {
    // 自动关闭通知
    document.querySelectorAll('.alert').forEach(function(alert) {
        if (!alert.querySelector('.btn-close')) return;
        
        setTimeout(function() {
            const bsAlert = new bootstrap.Alert(alert);
            bsAlert.close();
        }, 5000);
    });
}

/**
 * 显示通知
 */
function showNotification(message, type = 'info') {
    const alertContainer = document.getElementById('alert-container') || createAlertContainer();
    
    const alert = document.createElement('div');
    alert.className = `alert alert-${type} alert-dismissible fade show`;
    alert.innerHTML = `
        <i class="bi bi-${getIconForType(type)} me-2"></i>
        ${message}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    `;
    
    alertContainer.appendChild(alert);
    
    // 自动关闭
    setTimeout(function() {
        const bsAlert = new bootstrap.Alert(alert);
        bsAlert.close();
    }, 5000);
}

/**
 * 创建通知容器
 */
function createAlertContainer() {
    const container = document.createElement('div');
    container.id = 'alert-container';
    container.className = 'position-fixed top-0 end-0 p-3';
    container.style.zIndex = '1050';
    document.body.appendChild(container);
    return container;
}

/**
 * 获取通知类型对应的图标
 */
function getIconForType(type) {
    const icons = {
        'success': 'check-circle',
        'danger': 'exclamation-triangle',
        'warning': 'exclamation-circle',
        'info': 'info-circle'
    };
    return icons[type] || 'info-circle';
}

/**
 * 初始化加载状态
 */
function initLoadingStates() {
    // 表单提交加载状态
    document.querySelectorAll('form').forEach(function(form) {
        form.addEventListener('submit', function() {
            const submitBtn = form.querySelector('button[type="submit"]');
            if (submitBtn) {
                showLoadingState(submitBtn);
            }
        });
    });
    
    // AJAX请求加载状态
    document.querySelectorAll('[data-ajax]').forEach(function(element) {
        element.addEventListener('click', function(e) {
            e.preventDefault();
            showLoadingState(this);
            
            // 模拟AJAX请求
            setTimeout(() => {
                hideLoadingState(this);
            }, 2000);
        });
    });
}

/**
 * 显示加载状态
 */
function showLoadingState(element) {
    element.disabled = true;
    element.setAttribute('data-original-text', element.textContent);
    
    const spinner = document.createElement('span');
    spinner.className = 'spinner-border spinner-border-sm me-2';
    spinner.setAttribute('role', 'status');
    
    element.innerHTML = '';
    element.appendChild(spinner);
    element.appendChild(document.createTextNode('处理中...'));
}

/**
 * 隐藏加载状态
 */
function hideLoadingState(element) {
    element.disabled = false;
    const originalText = element.getAttribute('data-original-text');
    if (originalText) {
        element.textContent = originalText;
        element.removeAttribute('data-original-text');
    }
}

/**
 * 初始化主题切换
 */
function initThemeToggle() {
    // 检查系统主题偏好
    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
        document.body.classList.add('dark-theme');
    }
    
    // 监听系统主题变化
    if (window.matchMedia) {
        window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', function(e) {
            if (e.matches) {
                document.body.classList.add('dark-theme');
            } else {
                document.body.classList.remove('dark-theme');
            }
        });
    }
}

/**
 * AJAX工具函数
 */
function ajaxRequest(url, options = {}) {
    const defaults = {
        method: 'GET',
        headers: {
            'Content-Type': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        }
    };
    
    // 添加CSRF令牌
    const csrfToken = document.querySelector('[name=csrfmiddlewaretoken]');
    if (csrfToken) {
        defaults.headers['X-CSRFToken'] = csrfToken.value;
    }
    
    const config = Object.assign(defaults, options);
    
    return fetch(url, config)
        .then(response => {
            if (!response.ok) {
                throw new Error(`HTTP error! status: ${response.status}`);
            }
            return response.json();
        })
        .catch(error => {
            console.error('AJAX request failed:', error);
            showNotification('请求失败，请稍后重试', 'danger');
            throw error;
        });
}

/**
 * 复制到剪贴板
 */
function copyToClipboard(text) {
    if (navigator.clipboard) {
        navigator.clipboard.writeText(text).then(function() {
            showNotification('已复制到剪贴板', 'success');
        }, function(err) {
            console.error('复制失败:', err);
            showNotification('复制失败', 'danger');
        });
    } else {
        // 降级方案
        const textArea = document.createElement('textarea');
        textArea.value = text;
        document.body.appendChild(textArea);
        textArea.select();
        
        try {
            document.execCommand('copy');
            showNotification('已复制到剪贴板', 'success');
        } catch (err) {
            console.error('复制失败:', err);
            showNotification('复制失败', 'danger');
        }
        
        document.body.removeChild(textArea);
    }
}

/**
 * 格式化日期
 */
function formatDate(date, format = 'YYYY-MM-DD HH:mm') {
    const d = new Date(date);
    const year = d.getFullYear();
    const month = String(d.getMonth() + 1).padStart(2, '0');
    const day = String(d.getDate()).padStart(2, '0');
    const hours = String(d.getHours()).padStart(2, '0');
    const minutes = String(d.getMinutes()).padStart(2, '0');
    
    return format
        .replace('YYYY', year)
        .replace('MM', month)
        .replace('DD', day)
        .replace('HH', hours)
        .replace('mm', minutes);
}

/**
 * 防抖函数
 */
function debounce(func, wait) {
    let timeout;
    return function executedFunction(...args) {
        const later = () => {
            clearTimeout(timeout);
            func(...args);
        };
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
    };
}

/**
 * 节流函数
 */
function throttle(func, limit) {
    let inThrottle;
    return function() {
        const args = arguments;
        const context = this;
        if (!inThrottle) {
            func.apply(context, args);
            inThrottle = true;
            setTimeout(() => inThrottle = false, limit);
        }
    }
}

// 导出函数供其他脚本使用
window.DNSAdmin = {
    showNotification,
    copyToClipboard,
    formatDate,
    ajaxRequest,
    debounce,
    throttle,
    showLoadingState,
    hideLoadingState
};